import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';

import { DatePickerProps } from 'antd';
import { RangePickerProps } from 'antd/lib/date-picker';
import { Button, SelectBox } from 'devextreme-react';
import { useModel } from 'umi';
import './_style.less';
// import ZtSelect from '@/pages/InventoryAnalysis/components/search/ZtSelect';

export interface SearchRenderAProps {
  yearDate: string[] | null; //2024
  Transaction_Type?: string[];
  ChangeTransactionType?: any;
  setSummeryCallback?: any;
  pageType?: any;
}

export interface FowardSearchRenderA {
  getFormSearchValues: () => SearchRenderAProps;
}

const SearchRenderD = forwardRef(
  (props: SearchRenderAProps, ref: React.ForwardedRef<FowardSearchRenderA>) => {
    const {
      yearDate: propsYearDate,
      Transaction_Type,
      ChangeTransactionType,
      setSummeryCallback,
      pageType,
    } = props;

    const yearDateModel: any = useModel('qjModel');
    const { initialState } = useModel('@@initialState');
    const { zcbfName } = initialState?.curPart as any;
    const ztModel = useModel('ztModel');

    const { ztDates, dataList } = ztModel;
    const CuurentYear = useRef<any[]>([ztDates.at(-1)]);
    const [displaydataId, SetdisplaydataId] = useState<any>(`${dataList.at(-1)?.displayName}`);
    useEffect(() => {
      ztModel.refresh();
    }, []);

    useEffect(() => {
      // setDates(ztDates);
    }, [ztDates]);

    const OnClickSetSummeryCallback = (
      a: any,
      e: any | DatePickerProps['value'] | RangePickerProps['value'],
      c?: any,
    ) => {
      if (a === '年度单') {
        SetdisplaydataId(e.itemData.displayName);
        CuurentYear.current = [e.itemData.Data_ID, e.itemData.Data_ID];
      }
      setSummeryCallback(CuurentYear.current, a, CuurentYear.current);
    };

    useImperativeHandle(
      ref,
      () => {
        return {
          getFormSearchValues: () => {
            return CuurentYear.current;
          },
        };
      },
      [],
    );

    return (
      <>
        <div className={'ButtonPading'} style={{ display: 'flex', zIndex: 1000 }}>
          <div style={{ display: 'flex', alignItems: 'center' }}>
            <div style={{ margin: '0 8px' }}>账套：</div>
            <SelectBox
              width="220"
              //   style={{ margin: '0 8px' }}
              dataSource={dataList}
              value={displaydataId}
              valueExpr="displayName"
              displayExpr="displayName"
              onItemClick={OnClickSetSummeryCallback.bind(this, '年度单')}
              // defaultValue={ztDates.at(-1)}
              dropDownOptions={{
                width: '250px',
              }}
            ></SelectBox>
            <Button
              text="计价方式设置"
              type="default"
              style={{ margin: '0 10px', height: '32px' }}
              onClick={OnClickSetSummeryCallback.bind(this, '计价方式')}
            ></Button>
          </div>
        </div>
      </>
    );
  },
);

export default SearchRenderD;
